<template>
  <div class="update-gende">
    <van-picker show-toolbar :default-index="defaultIndex" :columns="columns" @cancel="$emit('close')"
      @confirm="onConfirm" @change="onGenderChange"/>
  </div>
</template>
<script>
  import {
    updateUserProfile
  } from '@/api/user'
  export default {
    name: "update-gender",
    props: {
      value: {
        type: Number,
        required: true
      }
    },
    data() {
      return {
        columns: ['男', '女'],
        defaultIndex: this.value,
      }
    },
    methods: {
      onGenderChange(pick,value,index){
        this.defaultIndex = index
      },
      async onConfirm() {
        this.$toast.loading({
          message: '保存中',
          forbidclick: true // 禁止背景点击
        })
        await updateUserProfile({
            gender: this.defaultIndex
          })
          this.$toast.success('保存成功')
          this.$emit('input', this.defaultIndex)
          this.$emit('close')
      },
    }
  }
</script>
<style scoped>
</style>